<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/index.css">

    <!-- 地图 -->
    <link href="css/chunk-7305b8f4.b1341d14.css" rel="prefetch">
    <link href="js/chunk-7305b8f4.daf3c850.js" rel="prefetch">
    <link href="css/chunk-vendors.a0d11cda.css" rel="preload" as="style">
    <link href="js/app.cd09a435.js" rel="preload" as="script">
    <link href="js/chunk-vendors.e52e50e8.js" rel="preload" as="script">
    <link href="css/chunk-vendors.a0d11cda.css" rel="stylesheet">

    <!-- 引入 ECharts -->
    <script src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/echarts.min.js"></script>

    <!-- 引入 Baidu Map 扩展组件 -->
    <script src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/extension/bmap.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <!-- 按钮样式 -->
    <link rel="stylesheet" href="css/buttonstyle.css">


    <!-- 左右滑动插件 -->

    <!-- <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script> -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap-grid.min.css">

    <link rel="stylesheet" href="css/lunbo.css">

    <link rel="stylesheet" href="css/gundongTEXT.css">

    <!-- 词云依赖插件 -->
    <script src="./js/echarts-wordcloud.min.js"></script>

    <style>
        .switch-btns {
            position: absolute;
            bottom: -20%;
            transform: translateY(-50%);
            display: flex;
            justify-content: space-between;
            width: 100%;
        }

        .switch-btnx {

            cursor: pointer;
        }
    </style>

</head>

<body>
    <div id="header">
        <div class="showTime">123123</div>
        <h1>推动乡村振兴——三农问题可视化分析平台 </h1>
        <div class="hrefgo"><a href="./frist/index.html">首页 | </a><a href="./index.html">可视化分析平台 | </a>
            <a href="./indexSingle.html">政策与指标画像 | </a>
            <a href="./indexTow.html">三农词云及其概览</a>
        </div>
        </div>
    </div>
    <!-- 页面主题部分 -->
    <div id="mainbox">
        <div class="column ">
            <div class="panel1 bar">
                <!-- <h2>历年粮食总量</h2> -->
                <div class="chart1">图表</div>
                <!-- <div class="panel-footer"></div> -->
            </div>
            <div class="panel line">

                <h2 id="demoh">

                    <div id="div1-1">
                        <a type="radio" name="sex" onclick="show()">
                            <img src="./images/返回.png" class="imgdemo">
                        </a>
                        <a href="#" type="radio" name="sex" onclick="show3()">农产品价格指数</a>
                    </div>
                    <div id="div2-1">
                        <a type="radio" name="sex" onclick="show()">
                            <img src="./images/返回.png" class="imgdemo">
                        </a>
                        <a href="#" type="radio" name="sex" onclick="show2()">22年耕地面积可视化</a>
                    </div>
                    <div id="div3-1">
                        <a type="radio" name="sex" onclick="show()">
                            <img src="./images/返回.png" class="imgdemo">
                        </a>
                        <a href="#" type="radio" name="sex" onclick="show1()">近年各省耕地面积</a>
                    </div>
                    <div id="div4-1">
                        <a type="radio" name="sex" onclick="show()">
                            <img src="./images/返回.png" class="imgdemo">
                        </a>
                        <a href="#" type="radio" name="sex" onclick="show4()">农民消费水平</a>
                    </div>
                </h2>
                <div class="divDemo" id="divDemo">
                    <button class="shiny" onclick="show3()">近年各省耕地面积</button>
                    <button class="shiny" onclick="show2()">22年耕地面积可视化</button>
                    <button class="shiny" onclick="show1()">农产品价格指数</button>
                    <button class="shiny" onclick="show4()">农民消费水平</button>
                </div>
                <div class="chart" id="div1">图表</div>
                <div class="chart map2" id="div2">地图</div>
                <div class="chart dongtu" id="div3">动态图</div>
                <div class="chart xiaofei" id="div4">动态图</div>
                <!-- <div class="panel-footer"></div> -->
            </div>
            <div class="panel pie">
                <div class="switch-btns">
                    <button class="switch-btnx switch" onclick="zuo1()" id="last">
                        1
                    </button>
                    <button class="switch-btnx switch" onclick="zuo2()" id="next">2</button>
                    <button class="switch-btnx switch" onclick="zuo3()" id="next">3</button>
                    <button class="switch-btnx switch" onclick="zuo4()" id="next">4</button>
                </div>
                <div class="chartx flagchartx" id="cdrf1">图表1</div>
                <div class="chart flagchartx" id="cdrf2">图表2</div>
                <div class="chart2 flagchartx" id="cdrf3">图表3</div>
                <div class="chart3 flagchartx" id="cdrf4">图表4</div>
            </div>
        </div>
        <div class="column">
            <!-- no模块制作 -->
            <!-- <div class="no">
                <div class="no-hd">
                    <ul>
                        <li>各省往年粮食产量可视化</li>
                        <li>654321</li>
                    </ul>
                </div>
                <div class="no-bd">
                    <ul>
                        <li>前端需求人数</li>
                        <li>市场供应人数</li>
                    </ul>
                </div>
            </div> -->
            <!-- 地图模块 -->
            <!--             <div class="map">
                <div class="map1"></div>
                <div class="map2"></div>
                <div class="map3"></div>
                <div class="chart">地图模块</div>
            </div> -->


            <div id="app"></div>
            <script src="js/chunk-vendors.e52e50e8.js"></script>
            <script src="js/app.cd09a435.js"></script>


        </div>
        <div class="column">
            <div class="panel2 bar1">
                <div class="chart2">图表</div>
                <!-- <div class="panel-footer"></div> -->
            </div>
            <div class="panel line1">
                
                <h2>城乡就业情况</h2>
                <div class="chart">图表</div>
                <div class="panel-footer"></div>
            </div>
            <!-- <div class="panel pie1">
                <h2>三农热点词云</h2>
                <div class="chart">图表</div>
                <div class="panel-footer"></div>
            </div> -->
            <div class="panel pie1">
                <div class="centerBox" id="box">
                    <div class="wraptit"> 
                        <!-- <span>订单号</span><span>订单金额</span><span>计划时间</span><span>当前状态</span> </div> -->
                    <!-- <div class="wrap"> -->
                        <ul id="ul1" class="wrap">
                            <li>
                                <p><span>- 中央国务院：抓紧抓好粮食和重要农产品稳产保供</span> <span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 中央国务院：加强农业基础设施建设</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 中共中央国务院：巩固拓展脱贫攻坚成果</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 习主席:解决好“三农”问题是全党工作重中之重</span><span>2023年3月31日</span></p>
                            </li>
                            <li>
                                <p><span>- 中央国务院：2023年全面推进乡村振兴</span><span>2023年2月3日</span></p>
                            </li>
                            <li>
                                <p><span>- 中共中央国务院：加强农业资源保护和环境治理</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 中共中央国务院：培育壮大乡村产业</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 中共中央国务院：拓宽农民增收致富渠道</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 中共中央：加强农业资源保护和环境治理</span><span>2023年1月2日</span></p>
                            </li>
                            <li>
                                <p><span>- 党二十大：保民生、优产业、助三农</span><span>2022年10月22日</span></p>
                            </li>

                            <li>
                                <p><span>- 习近平总书记：乡村振兴战略与新时代“三农”工作</span><span>2022年9月21日</span></p>
                            </li>
                            <li>
                                <p><span>- 习近平总书记：举全党全社会之力推动乡村振兴</span><span>2022年3月31日</span></p>
                            </li>
                            <li>
                                <p><span>- 习近平总书记：牢牢把住粮食安全主动权</span><span>2022年3月31日</span></p>
                            </li>
                        </ul>
                        <ul id="ul2" class="wrap"></ul>
                    <!-- </div> -->
                    <!-- <ul id="ul1">

                    </ul> -->
                    
                </div>
                <script>
                    window.onload = roll(100); //速度控制数值越大，速度越慢
                    function roll(t) {
                        var ul1 = document.getElementById("ul1");
                        var ul2 = document.getElementById("ul2");
                        var box = document.getElementById("box");
                        ul2.innerHTML = ul1.innerHTML;
                        box.scrollTop = 0;
                        var timer = setInterval(rollStart, t);
                        box.onmouseover = function () {
                            clearInterval(timer)
                        }
                        box.onmouseout = function () {
                            timer = setInterval(rollStart, t);
                        }
                    }

                    function rollStart() {
                        if (box.scrollTop >= ul1.scrollHeight) {
                            box.scrollTop = 0;
                        } else {
                            box.scrollTop++;
                        }
                    }
                </script>
            </div>
        </div>
    </div>
</body>
<script src="./js/flexible.js"></script>
<!-- <script src="./js/echarts.min.js"></script> -->
<!-- <script src="js/jquery.js"></script> -->
<script src="./js/index.js"></script>
<script src="./js/china.js"></script>
<script src="./js/myMap.js"></script>
<script src="./js/OurMap.js"></script>
<script src="./js/control.js"></script>


<script>
    var t = null
    t = setTimeout(time, 1000)
    function time() {
        clearInterval(t)//清楚定时器
        dt = new Date()
        var y = dt.getFullYear()
        var mt = dt.getMonth() + 1
        var day = dt.getDate()
        var h = dt.getHours()
        var m = dt.getMinutes()
        var s = dt.getSeconds()
        document.querySelector(".showTime").innerHTML = '当前时间:' + y + '年' + mt + '月' + day
            + '日' + '-' + h + '时' + m + '分' + s + '秒'
        t = setTimeout(time, 1000)//设定定时器，循环运行
    }
</script>







</html>